﻿@model Gateway.Console.Models.RoleModel

@{
    ViewBag.Title = "Role Details";
}

<h2>Role Details</h2>

@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()

    @Html.ValidationSummary(true)
    @Html.HiddenFor(model => model.Id)
    @Html.HiddenFor(model => model.IsDefaultRole)
    
    if (Model.IsDefaultRole)
    {
        @Html.HiddenFor(model => model.RoleName)
    }
    else
    { 
        <div class="form-group">
            @Html.LabelFor(model => model.RoleName)
            @Html.TextBoxFor(model => model.RoleName, new { @class = "form-control wide" })
            @Html.ValidationMessageFor(model => model.RoleName)
        </div>
    }

    <div id="flightsRows" class="panel panel-default">
        <div class="panel-heading">@Html.DisplayNameFor(model => model.Flights)</div>
        <table class="table table-hover" id="flights-table">
            <thead>
                <tr>
                    <th class="col-sm-1">Weight</th>
                    <th class="col-sm-4">Target Address</th>
                    <th class="col-sm-2">IP Addresses</th>
                    <th class="col-sm-2">Users</th>
                    <th class="col-sm-2">Tenants</th>
                    <th class="col-sm-1"></th>
                </tr>
            </thead>

            <tbody>
                @foreach (var item in Model.Flights)
                {
                    @Html.Partial("FlightRow", item)
                }
            </tbody>
        </table>
        <div class="panel-footer"><a href="#" id="add-flight-row">Add New</a></div>
    </div>

    <div id="restrictionRows" class="panel panel-default">
        <div class="panel-heading">@Html.DisplayNameFor(model => model.Restrictions)</div>
        <table class="table table-hover" id="restrictions-table">
            <thead>
                <tr>
                    <th>
                        Restricted Path
                    </th>
                    <th></th>
                </tr>
            </thead>

            <tbody>
                @foreach (var item in Model.Restrictions)
                {
                    @Html.Partial("RestrictionRow", item)
                }
            </tbody>
        </table>
        <div class="panel-footer"><a href="#" id="add-restriction-row">Add New</a></div>
    </div>

    <div class="form-actions no-color">
        <input type="submit" value="Save" class="btn btn-default" />
    </div>
}
<hr />

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

@section Scripts {
    <script type="text/javascript">
        $(document).ready(function () {
            $('a.delete-restriction-row').click(removeRowEvent);
            $('#add-restriction-row').click(function () {
                var key = 'RestrictionsKey_' + Math.random().toString();
                var html = '<tr>';
                html += '<input type="hidden" name="Restrictions.index" autocomplete="off" value="' + key + '" />';
                html += '<input name="Restrictions[' + key + '].Id" type="hidden" value="0" />';
                html += '<input name="Restrictions[' + key + '].RoleId" type="hidden" value="' + @Model.Id + '" />';
                html += '<td><input class="form-control full-width" data-val="true" data-val-required="The Restricted Path field is required." name="Restrictions[' + key + '].RestrictBelow" type="text" />';
                html += '<span class="field-validation-valid" data-valmsg-for="Restrictions[' + key + '].RestrictBelow" data-valmsg-replace="true"></span></td>';
                html += '<td><a href="#" class="delete-restriction-row" onClick="removeRow($(this))">Delete</a></td>';
                html += '</tr>';

                $('#restrictions-table > tbody:last').append(html);
            });
            $('a.delete-flight-row').click(removeRowEvent);
            $('#add-flight-row').click(function () {
                var key = 'FlightsKey_' + Math.random().toString();
                var html = '<tr>';
                html += '<input type="hidden" name="Flights.index" autocomplete="off" value="' + key + '" />';
                html += '<input name="Flights[' + key + '].Id" type="hidden" value="0" />';
                html += '<input name="Flights[' + key + '].RoleId" type="hidden" value="' + @Model.Id + '" />';
                html += '<td><input class="form-control" data-val="true" data-val-number="The field Distribution Weight must be a number." data-val-range="The field Distribution Weight must be between 1 and 100000000000." data-val-range-max="100000000000" data-val-range-min="1" data-val-required="The Distribution Weight field is required." name="Flights[' + key + '].Weight" type="text" value="1" />';
                html += '<span class="field-validation-valid" data-valmsg-for="Flights[' + key + '].Weight" data-valmsg-replace="true"></span></td>';
                html += '<td><input class="form-control full-width" data-val="true" data-val-required="The Target Address field is required." name="Flights[' + key + '].Redirect" type="text" />';
                html += '<span class="field-validation-valid" data-valmsg-for="Flights[' + key + '].Redirect" data-valmsg-replace="true"></span></td>';
                html += '<td><input class="form-control" name="Flights[' + key + '].Addresses" type="text">';
                html += '<td><input class="form-control" name="Flights[' + key + '].Users" type="text">';
                html += '<td><input class="form-control" name="Flights[' + key + '].Tenants" type="text">';
                html += '<td><a href="#" class="delete-flight-row" onClick="removeRow($(this))">Delete</a></td>';
                html += '</tr>';

                $('#flights-table > tbody:last').append(html);
            });
        });

        function removeRowEvent(e) {
            removeRow($(this))
        }

        function removeRow(anchor) {
            anchor.parents("tr:first").remove();
            return false;
        }
    </script>
}